<template>
    <div class="flex_col m5" style="align-items: start;">
        <div class="flex_row">
            <el-button @click="onClickPing" type="primary">Ping</el-button>
            <el-button type="primary" @click="onClickQueryVersion">查询app版本</el-button>
            <el-button type="primary" @click="onClickQueryVend">查询是否正在销售或者出货</el-button>
        </div>
        <div class="flex_row mt5">
            <el-button type="primary" @click="onClickUploadOrder">订单上传</el-button>
            <el-button type="warning" @click="onClickReset">设备复位</el-button>
            <el-button type="warning" @click="onClickProductInit">更新产品信息</el-button>
        </div>
        <div class="flex_row mt5">
            <DeviceStatusParts/>
            <ScreenShot/>
        </div>
    </div>
</template>

<script lang="ts" setup>
import DeviceStatusParts from '@/parts/DeviceStatusParts.vue';
import ScreenShot from '@/parts/ScreenShot.vue';
import remote from '@/service/remote';
import { runAction, runAction3 } from '@/utils/ui';

async function onClickPing() {
    runAction('远程控制', 'Ping', async () => {
        await remote.ping();
    });
}

async function onClickQueryVersion() {
    runAction3('远程控制', '查询app版本', async () => {
        const version = await remote.appVersion();
        return `app版本:${version}`;
    });
}

async function onClickQueryVend() {
    runAction3('远程控制', '查询销售/出货', async () => {
        const flag = await remote.vendFlag();
        if (flag) {
            return '正在销售/出货';
        } else {
            return '设备空闲';
        }
    })
}

async function onClickUploadOrder() {
    runAction('远程控制', '订单上传', async () => {
        await remote.uploadOrder();
    })
}

async function onClickReset() {
    runAction('远程控制', '设备复位', async () => {
        await remote.reset();
    });
}

async function onClickProductInit() {
    runAction('远程控制', '更新产品信息', async () => {
        await remote.productInit();
    });
}

</script>
